﻿@using FrogFoot.Utilities
@model List<FrogFoot.Entities.Post>
@{
    ViewBag.Title = "Posts";
}

<link rel="stylesheet" href="//cdn.datatables.net/1.10.8/css/jquery.dataTables.min.css" />

<h2>Posts</h2>

<div class="form-group" style="margin-top: 30px;">
    @Html.ActionLink("Create Post", "Create", null, new { @class = "btn btn-success" })
</div>

<table id="postTable" class="table table-striped table-responsive">
    <thead>
        <tr>
            <td style="display: none;"></td>
            <td>Type</td>
            <td>Gridding</td>
            <td>Precinct</td>
            <td>Suburb</td>
            <td>Zone</td>
            <td>Title</td>
            <td>Pub Date</td>
            <td style="max-width: 200px;">Body</td>
            <td></td>
        </tr>
    </thead>
    <tbody>
        @{
            foreach (var post in Model)
            {
                var postBody = HtmlStripper.Strip(post.Body);
                <tr>
                    <td style="display: none;">@post.PostId</td>
                    <td>@post.Type.ToString()</td>
                    <td>@(string.IsNullOrEmpty(post.PrecinctCode) && post.Zone == null ? "Suburb" : post.GridType.ToString())</td>
                    <td>@(post.PrecinctCode)</td>
                    <td>@(post.Location != null && string.IsNullOrEmpty(post.PrecinctCode) ? post.Location.Name : "")</td>
                    <td>@(post.Zone != null ? post.Zone.Code : "")</td>
                    <td>@post.Title</td>
                    <td>@post.PublishDate.Date()</td>
                    <td style="max-width: 200px;">@(Html.Raw(postBody.Truncate(100) + "..."))</td>

                    <td style="min-width: 100px;">
                        @Html.ActionLink("Edit", "Edit", new { postId = post.PostId }) |
                        @Html.ActionLink("Delete", "Delete", new { postId = post.PostId }, new { @class = "delete" })
                    </td>
                </tr>
                            }
        }
    </tbody>
</table>

@section scripts
{
    <script src="//cdn.datatables.net/1.10.8/js/jquery.dataTables.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('#postTable').DataTable({
                "paging": true,
                "ordering": true,
                "order": [[0, "desc"]]
            });

            $('#postTable').on('click', '.delete', function () {
                if (confirm("Are you sure you want to delete this post?")) {
                    return true;
                } else {
                    return false;
                }
            });
        })
    </script>
}

